<template>
  <div class="other-details">
    <div class="breadcrumb-link">
      <span @click="fallBack" style="cursor: pointer;">Bidding information</span>
      <i class="el-icon-arrow-right"></i>
      <span>Other Details</span>
    </div>
    <div class="project-header">
      <div class="project-title">
        <span class="title">天合科技-测试仪器及仪表</span>
        <span class="tips">标讯提取进行中，敬请期待～</span>
      </div>
      <div class="collection">
        <i class="iconfont icon-xingxing1" :class="{'collection-detail': collectionDetail}" @click="changeCollectionState"></i>
      </div>
    </div>
  </div>
</template>

<script>
  import {getBiddingParams,getUsername} from "../../../utils/auth";
    export default {
      name: "OtherDetails",
      data() {
       return {
         collectionDetail: false, // 收藏
         biddingParams: {}, // session得到的对象
       }
      },
      methods: {
        fallBack() {
          this.$router.go(-1)
        },
        // changeCollectionState() {
        //   this.collectionDetail = !this.collectionDetail
        // },
        async changeCollectionState() {
          let params = {
            object_id: this.biddingParams.uuid,
            username: getUsername()
          }
          if (this.collectionDetail === 0 ) {
            this.collectionDetail = 1
            let res = await this.axios.post('collectionBidding/addAndDeleteCollection', params)
            if (res.data.status === 200) {
              this.$message.success('收藏成功');
            } else {
              this.$message.error('收藏失败');
            }
          } else {
            this.collectionDetail = 0
            let res = await this.axios.post('collectionBidding/addAndDeleteCollection', params)
            if (res.data.status === 200) {
              this.$message.warning('取消收藏成功');
            } else {
              this.$message.error('取消收藏失败');
            }
          }
        },
      },
      created() {
        this.biddingParams = JSON.parse(getBiddingParams())
        this.collectionDetail = this.biddingParams.collect
      },
    }
</script>

<style lang="scss" scoped>
  .other-details{
    padding:20px;
    .breadcrumb-link{
      font-family: OpenSansShin;
      font-size: 20px;
      color: #FF5B00;
    }
    .project-header{
      position:relative;
      margin-top:12px;
      padding:20px;
      background: rgba(16,142,233,0.12);
      border-radius: 6px 6px 0 0;
      .project-title{
        span{
          margin-right:20px;
          font-family: OpenSans-Bold;
          font-weight: bold;
          font-size: 14px;
          color: #000000;
        }
        .title{
          font-size: 20px;
        }
        .tips{
          display: block;
          margin-top: 10px;
          color: #FF5B00;
        }
      }
      .collection{
        position:absolute;
        top:20px;
        right:48px;
        .icon-xingxing1 {
          display: inline-block;
          transform: scale(1.5, 1.5);
          padding-left: 5px;
          cursor: pointer;
          color: #b8b8b8;
        }
        .collection-detail {
          color: #f0ba00;
        }
      }
    }
  }

</style>
